<template>
	<view>
		<view style="height:400rpx;
		width: 100%;
		background-color: white;">
			<view class="user">
				<view class="userimage">
					<img src="../.././static/R-C.jpg" alt="">
				</view>
			</view>
		</view>

		<view class="box">
			<view @click="go(1)" class="userinfo" style="border-bottom: 1rpx solid;">
				<span>个人信息</span>
			</view>
			<view @click="go(2)" class="devicemanage" style="border-bottom: 1rpx solid;">
				<span>设备管理</span>
			</view>
			<view @click="go(3)" class="contact" style="border-bottom: 1rpx solid;">
				<span>联系我们</span>
			</view>
			<view @click="go(4)" class="about">
				<span>关于</span>
			</view>
		</view>
		<button class="btn" @click="logout">退出登录</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		onload() {

		},
		methods: {
			go(index) {
				if (index == 1) {
					uni.navigateTo({
						url: '/pages/list/userinfo'
					})
				} else if (index == 2) {
					uni.navigateTo({
						url: '/pages/list/devicemanage'
					})
				} else if (index == 3) {
					uni.navigateTo({
						url: '/pages/list/contact'
					})
				} else if (index == 4) {
					uni.navigateTo({
						url: '/pages/list/about'
					})
				}
			},
			logout() {
				let token = uni.getStorageSync('token');
				uni.clearStorageSync();
				console.log('token')
				uni.navigateTo({
					url: '../index/index',
					success: res => {
						console.log(res)
					},
					fail: (res) => {
						console.log(res)
					},
					complete: () => {}
				});
			}
		}

	}
</script>

<style scoped>
	* {
		margin: 0;
		padding: 0;
	}

	.user {
		width: 100%;
		height: 400rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		position: absolute;
		background-image: linear-gradient(120deg, #a1c4fd 0%, #c2e9fb 100%);
	}

	.userimage {
		width: 240rpx;
		height: 240rpx;
		border-radius: 120rpx;
		background-color: aqua;
		overflow: hidden;
	}

	img {
		width: 240rpx;
		height: 240rpx;
	}

	.box {
		width: 90%;
		background-color: white;
		margin-left: 5%;
		margin-top: 5%;
		border-radius: 24rpx;
	}

	.userinfo,
	.about,
	.devicemanage,
	.contact {
		width: 80%;
		height: 140rpx;
		margin-left: 10%;
	}

	span {
		height: 140rpx;
		line-height: 140rpx;
	}
</style>